<!--
 * @Author: JohnYang
 * @Date: 2020-09-30 19:01:42
 * @LastEditors: JohnYang
 * @LastEditTime: 2020-09-30 21:16:24
-->
<template>
  <el-upload
    v-on="$listeners"
    v-bind="$attrs"
    list-type="picture-card"
    :data="{ type }"
    :action="uploadUrl"
    name="upload"
    :on-remove="handleRemove"
    :on-success="handleSuccess"
    multiple
  >
    <i class="el-icon-plus"></i>
  </el-upload>
</template>

<script>
import { getToken, getAccount } from "@/utils/auth";
export default {
  name: "FileUpload",
  data() {
    return {
      basePath: process.env.VUE_APP_BASE_API
    };
  },
  props: {
    type: {
      required: true
    }
  },
  computed: {
    uploadUrl() {
      return (
        this.basePath +
        "/index/index/upload?token=" +
        getToken() +
        "&account=" +
        getAccount()
      );
    }
  },
  methods: {
    handleRemove(file, fileList) {
      this.$emit(
        "change",
        fileList.map(x => {
          return x.response ? x.response.data.url : x.url;
        })
      );
    },
    handleSuccess(response, file, fileList) {
      this.$emit(
        "change",
        fileList.map(x => {
          return x.response ? x.response.data.url : x.url;
        })
      );
    }
  }
};
</script>
